<!-- 示例 》 用户 》 组织 -->

<template>
  <EasyCard v-bind="$props" class="DemoUser-UserOrgan" noPadding>
    <EasyTree
      v-model="param.leftId"
      :tree="organ_tree"
      :field="organ_TREE_FIELD"
      hasReset
      filterPrefix="iconfont icon-sousuo"
      @change="startList(1)"
    >
      <template #top>
        <BtnPrimary title="顶部按钮" plain @click="clickTopBtn" />
      </template>
      <template #bottom>
        <BtnPrimary title="底部按钮" plain @click="clickBottomBtn" />
      </template>
    </EasyTree>
  </EasyCard>
</template>

<script>
// ============================== 导入依赖 ============================== //

import CORE from '@/CORE'

// ============================== 导出组件 ============================== //

export default {
  /**
   * 名称定义 (实际使用名称)
   */
  name: 'UserOrgan',

  /**
   * 混入列表 (配置选项合并)
   */
  mixins: [CORE.mixWeb(), CORE.mixTree('organ', 'organ_')],

  /**
   * 属性注册 (抽取以便查阅)
   */
  props: CORE.WEB.EasyCard,

  /**
   * 本地方法 (轻量重要在前)
   */
  methods: {
    /**
     * 点击顶部按钮
     */
    clickTopBtn() {
      CORE.MSG.info('已点击顶部按钮')
    },

    /**
     * 点击底部按钮
     */
    clickBottomBtn() {
      CORE.MSG.info('已点击底部按钮')
    },
  },
}
</script>
